資料庫

因為只是要做最陽春的版本，所以只有一欄存輸入的網址，輸出的短網址就直接id，反正id不會重複。如果想要用亂碼當短網址就要再開一欄。

以下是Laravel的migration，預設還有時間戳記，我就留著。

Schema::create('links', function (Blueprint $table) {
    $table->id();
    $table->string('original_adress');
    $table->timestamps();
});

路由web.php

get'/'就是輸入頁，post'/'就是把輸入的網址存進資料庫並回傳短網址。
get'/<輸入的id>'就根據id導到對應的網站。

Route::get('/', function () {
    return view('input');
});

Route::get('/{id}',[App\Http\Controllers\LinkController::class,'redirect']);

Route::post('/',[App\Http\Controllers\LinkController::class,'store']);

Model

我的model是叫Link，用Laravel創建的話是php artisan make:model Link。
同時創建migration和controller的話可以這樣：php artisan make:model Link -mc。
Link Model class 記得要把$guarded打開。

protected $guarded=[];

Controller

Controller很簡單，就兩個功能：存(store)跟重導向(redirect)。

public function redirect()
{
	$id = (trim($_SERVER['REQUEST_URI'],'/'));
	$address = Link::where('id',$id)->firstOrFail()->original_adress;

	return header("Location:". $address);
}

public function store()
{
	//檢查輸入網址是否之前輸入過，如果有就回傳之前的結果，
	//避免資料庫存入大量同樣網址。
	if(Link::where('original_adress',request('original_address'))->first()!= Null)
	{
		$link = Link::where('original_adress',request('original_address'))->firstOrFail();

		return view('input',[
			'link'=>$link
		]);
	//如果是新的網址，就新增一筆資料並把那筆資料也傳到前端。
	}else{
		$link = Link::create([
		'original_adress'=>request('original_address')
		]);

		return view('input',[
			'link'=>$link
		]);
	}
}

前端View

前端只有輸入原網址欄和輸出結果短網址。

我的頁面檔input.blade.php:

<h1>URL shortener</h1>
<form action="/" method="post">
	@csrf

	<input type="text" name="original_address" required>
	<input type="submit">
</form>

@if(isset($link))
	<div class="result">
		<p>Result link:<a 
			href="http://urlshortener.test/{{$link->id}}">
			http://urlshortener.test/{{$link->id}}</a>
		</p>
	</div>
@endif

結語

成品像這樣
https://imgur.com/4FwBT1s

想玩更多，可以加入計算點擊的功能，紀錄多少人透過網站導流。